import React from 'react'
import PropTypes from 'prop-types'
import { bindActionCreators } from './miniRedux'

export const connect = (mapStateToProps = state => state, mapDispatchToProps = {}) => (WrapperComponent) => {
    return class extends React.Component{
        static contextTypes = {
            store: PropTypes.object
        }
        constructor(props,context){
            super(props,context)
            this.state = {
                props: {}
            }
        }
        componentDidMount(){
            const { store } = this.context
            store.subscribe(() => this.update())
            this.update()
        }
        update(){
            const { store } = this.context
            const stateProps = mapStateToProps(store.getState())
            const dispatchProps = bindActionCreators(mapDispatchToProps, store.dispatch)
            this.setState({
                props: {
                    ...this.state.props,
                    ...stateProps,
                    ...dispatchProps
                }
            })
        }
        render(){
            return (
                <WrapperComponent {...this.state.props}/>
            )
        }
    }
}

export class Provider extends React.Component{
    static childContextTypes = {
        store: PropTypes.object
    }
    constructor(props,context){
        super(props, context)
        this.store = props.store
    }
    getChildContext(){
        return {store: this.store}
    }
    render(){
        return this.props.children
    }
}